<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html>

<head>
    <base href="<%=basePath%>"/>
    <title>襄阳蓝芯智能化办公系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="view/bootstrap-3.3.5/css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="view/bootstrapvalidator/css/bootstrapValidator.css" />
    <script charset="utf-8" src="view/jquery/jquery-1.10.2.min.js"></script>
    <script charset="utf-8" src="view/bootstrap-3.3.5/js/bootstrap.js"></script>
    <script charset="utf-8" src="view/bootstrapvalidator/js/bootstrapValidator.js"></script>
</head>
<body>

<div class="panel panel-primary">
    <div class="panel-heading">
        <h4 class="panel-title">[${khname}]关心的产品</h4>
    </div>
    <div class="panel-body">
        <form action="kehu/insertgx" id="myform"
              method="post" class="form-horizontal" role="form">
            <div class="form-group col-md-12">
                <label for="type" class="col-md-1 control-label">产品名称</label>
                <div class="col-md-3">
                    <input type="hidden" id="customerid" name="customerid"
                           value="${customerid}">
                    <select id="productid" name="productid" class="form-control">
                        <option value="">--请选择产品--</option>
                        <c:forEach items="${cplist}" var="cp">
                             <option value="${cp.oid}">${cp.linkname}</option>
                        </c:forEach>
                    </select>
                </div>
                <label for="type" class="col-md-1 control-label">客户意向</label>
                <div class="col-md-3">
                    <select id="status" name="status" class="form-control">
                        <option value="">--请选择产品--</option>
                        <option value="1">有意向</option>
                        <option value="2">已签订合同</option>
                        <option value="3">已付款</option>
                        <option value="4">已发货</option>
                        <option value="5">无效</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <button type="submit" class="btn btn-success">添加客户关心</button>
                    <button type="button" onclick="location.href='kehu/guanxin'"
                            class="btn btn-info">返回</button>
                </div>
            </div>
        </form>
    </div>
</div>


<!-- 列表 -->
<div class="panel panel-primary">
    <table class="table table-bordered table-hover">
        <thead>
        <tr class="thead-blue" align="center">
            <td>产品编号</td>
            <td>产品名称</td>
            <td>产品规格</td>
            <td>状态</td>
            <td>客户跟踪</td>
            <td>操作</td>
        </tr>
        </thead>
        <tbody>
       <c:forEach items="${list.data}" var="gx">
        <tr align="center">
            <td>${gx.oid}</td>
            <td>${gx.cp.linkname}</td>
            <td>${gx.cp.url}</td>
            <td>
                <c:if test="${gx.status==1}">
                    有意向
                </c:if>
                <c:if test="${gx.status==2}">
                    已签订合同
                </c:if>
                <c:if test="${gx.status==3}">
                    已付款
                </c:if>
                <c:if test="${gx.status==4}">
                    已发货
                </c:if>
                <c:if test="${gx.status==5}">
                    无效
                </c:if>

            </td>
            <td>
                <button onclick="addKhContactrecord(${gx.oid},'${gx.cp.linkname}')"
                        class="btn btn-success btn-xs" type="button">客户跟踪</button>
                <a type="button" href="kehu/genzongjilu?favoriteid=${gx.customerid}"
                   class="btn btn-info btn-xs">跟踪记录</a>
            </td>
            <td>
                <button onclick="updateKhCustomer(${gx.oid},${gx.customerid},${gx.productid},${gx.status},'${gx.cp.linkname}')"
                        class="btn btn-primary btn-xs" type="button">修改客户意向</button>
                <button type="button"
                        onclick="deleteKhCustomerfavorite(1,1)"
                        class="btn btn-danger btn-xs" data-toggle="modal"
                        data-target="#confirmModal">删除</button>
            </td>
        </tr>
       </c:forEach>
        </tbody>
    </table>
</div>

<div>
    <form action="kehu/guanxin?customerid=${customerid}" id="seachform" method="post"
          class="form-horizontal" role="form">
        <input type="hidden" name="page" id="page" value="1">
        <input type="hidden" name="pageSize" id="pageSize" value="5">
    </form>
</div>

<!-- 分页 -->
<div class="input-group col-md-6 col-md-offset-3">
    <div class="row">
        <div class="btn-group">
            <button onclick="gotoPage(1,${list.pageSize})" class="btn btn-primary" type="button">首页</button>
            <c:if test="${list.page==1 }">
                <button class="btn btn-primary disabled" type="button">上一页</button>
            </c:if>
            <c:if test="${list.page>1 }">
                <button onclick="gotoPage(${list.page-1},${list.pageSize})" class="btn btn-primary" type="button">上一页</button>
            </c:if>

            <button class="btn btn-primary disabled" type="button">当前第${list.page}/${list.pageCount}页</button>

            <div class="btn-group">
                <button type="button" class="btn btn-primary dropdown-toggle"
                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    每页显示${list.pageSize}条 <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    <li><a href=" ">每页显示5条</a></li>
                    <li><a href="javascript:gotoPage(1,10)">每页显示10条</a></li>
                    <li><a href="javascript:gotoPage(1,15)">每页显示15条</a></li>
                    <li><a href="javascript:gotoPage(1,20)">每页显示20条</a></li>
                </ul>
            </div>

            <button class="btn btn-primary disabled" type="button">共${list.rowCount}条记录</button>

            <c:if test="${list.page==list.pageCount }">
                <button class="btn btn-primary disabled" type="button">下一页</button>
            </c:if>
            <c:if test="${list.page<list.pageCount }">
                <button onclick="gotoPage(${list.page+1},${list.pageSize})"  class="btn btn-primary" type="button">下一页</button>
            </c:if>
            <button onclick="gotoPage(${list.pageCount },${list.pageSize})" class="btn btn-primary" type="button">尾页</button>
        </div>
    </div>
</div>

<!-- 修改客户意向 -->
<div class="modal fade" id="updateKhCustomerModal" tabindex="-1"
     role="dialog" aria-labelledby="updateKhCustomerLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-xs">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">&times;</button>
                <h4 class="modal-title">修改客户意向</h4>
            </div>
            <form action="kehu/updateguanxin" class="form-horizontal" role="form">
                <div class="modal-body">
                    <div class="form-group row">
                        <label class="col-md-4 control-label">关心的产品</label>
                        <div class="col-md-6">
                            <input type="text" id="productText" class="form-control" disabled>
                            <input type="hidden" name="oid" id="oid">
                            <input type="hidden" name="customerid" id="customerid1">
                            <input type="hidden" name="productid" id="productid1">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-md-4 control-label">客户意向</label>
                        <div class="col-md-6">
                            <select id="status1" name="status" class="form-control">
                                <option value="1">有意向</option>
                                <option value="2">已签订合同</option>
                                <option value="3">已付款</option>
                                <option value="4">已发货</option>
                                <option value="5">无效</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="submit" class="btn btn-primary">确认修改</button>
                </div>
            </form>
        </div>
    </div>
</div>


<!-- 添加客户跟踪 -->
<div class="modal fade" id="addKhContactrecordModal" tabindex="-1"
     role="dialog" aria-labelledby="addKhContactrecordLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-xs">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">&times;</button>
                <h4 class="modal-title">客户跟踪</h4>
            </div>
            <form action="kehu/insertgz" method="post" id="recordform" class="form-horizontal" role="form">
                <div class="modal-body">
                    <div class="form-group row">
                        <label class="col-md-3 control-label">关心的产品</label>
                        <div class="col-md-8">
                            <input type="text" id="productText1" class="form-control" disabled>
                            <input type="hidden" name="favoriteid" id="favoriteid">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-md-3 control-label">客户联系人</label>
                        <div class="col-md-8">
                            <select id="empid" name="empid" class="form-control">
                                <option value="">--请选择--</option>
                                <c:forEach items="${lxrlist}" var="lxr">
                                <option value="${lxr.oid}">${lxr.contactName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-md-3 control-label">事由</label>
                        <div class="col-md-8">
                            <input type="text" name="reason" id="reason" placeholder="请输入事由" class="form-control">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-md-3 control-label">联系结果</label>
                        <div class="col-md-8">
                            <textarea class="form-control" id="result" name="result" rows="5" placeholder="请输入联系结果"></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="reset" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="submit" class="btn btn-primary">确认添加</button>
                </div>
            </form>
        </div>
    </div>
</div>

<br>
<br>
<br>



<!-- 模态框（Modal） -->
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="confirmModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="confirmModalLabel">
                    提示
                </h4>
            </div>
            <div class="modal-body">
                确认删除吗？
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
                <button type="button" id="subconfirm" class="btn btn-primary">
                    提交更改
                </button>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function(){
        $("#subconfirm").click(function(){
            deleteConfirm();
            $('#confirmModal').modal('hide');
        });
    });
</script>


<!-- 模态框（Modal） -->
<div class="modal fade" id="alertMsgModal" tabindex="-1" role="dialog" aria-labelledby="alertMsgModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xs">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="alertMsgModalLabel">
                    提示
                </h4>
            </div>
            <div class="modal-body" id="alertmsg">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>






<script type="text/javascript">
    $(document).ajaxError(function(event,xhr) {
        if(xhr.status=="403"){//没有权限
            document.location.href = xhr.getResponseHeader("url");
        }else if(xhr.status!="200"){
            //alert("服务器错误!");
            console.log("服务器错误!");
        }
    });
</script>


</body>
<script type="text/javascript">
    function gotoPage(page,pageSize){
        $("#page").val(page);
        $("#pageSize").val(pageSize);
        $("#seachform").submit();
    }
    function searchBtn(){
        $("#page").val(1);
        $("#seachform").submit();
    }


    var deleteoid;
    var customerid;
    function deleteKhCustomerfavorite(oid,coid){
        deleteoid = oid;
        customerid = coid;
    }
    function deleteConfirm(){
        $.get("kehu/deletekhgx",{"oid":deleteoid},function(s){
            if(s==true){
                document.location.href="kehu/guanxin?customerid="+customerid;
            }else{
                $("#alertmsg").text("删除失败!当前关心的产品有跟踪记录!");
                $('#alertMsgModal').modal('show');
            }
        });
    }
    function updateKhCustomer(oid,customerid,productid,status,linkname){
        $('#oid').val(oid);
        $('#customerid1').val(customerid);
        $('#productid1').val(productid);
        $('#status1').val(status);
        $('#productText').val(linkname);
        $('#updateKhCustomerModal').modal('show');
    }
    function addKhContactrecord(oid,linkname){

        $('#favoriteid').val(oid);
        $('#productText1').val(linkname);
        $('#addKhContactrecordModal').modal('show');
    }

    $(document).ready(function() {

        myformValidator();
        recordformValidator();

        $('#addKhContactrecordModal').on('hidden.bs.modal', function() {//监听modal消失
            $("#recordform").data('bootstrapValidator').destroy();
            $('#recordform').data('bootstrapValidator',null);
            recordformValidator();//要重新绑定验证
            $("#recordform")[0].reset(); //将表单中的数据也清空
        });
    });

    function myformValidator(){
        $("#myform").bootstrapValidator({
            message : 'This value is not valid',
            feedbackIcons : {/*input状态样式图片*/
                valid : 'glyphicon glyphicon-ok',
                invalid : 'glyphicon glyphicon-remove',
                validating : 'glyphicon glyphicon-refresh'
            },
            fields : {
                productid : {
                    validators : {
                        notEmpty : {/*非空提示*/
                            message : '请选择关心的产品'
                        },
                        remote:{
                            url:"kehu/yngx",
                            delay:1000,
                            type:'post',
                            message:'当前产品已在客户关心列表!',
                            data:function(validator){
                                return {
                                    'customerid':$("#customerid").val(),
                                    'productid':$("#productid").val(),
                                };
                            }
                        }
                    }
                },
                status : {
                    validators : {
                        notEmpty : {/*非空提示*/
                            message : '请选择客户意向'
                        }
                    }
                }
            },
            submitHandler : function(validator,form, submitButton) {
                validator.defaultSubmit();
            }
        });
    }

    function recordformValidator(){
        $("#recordform").bootstrapValidator({
            message : 'This value is not valid',
            feedbackIcons : {/*input状态样式图片*/
                valid : 'glyphicon glyphicon-ok',
                invalid : 'glyphicon glyphicon-remove',
                validating : 'glyphicon glyphicon-refresh'
            },
            fields : {
                empid : {
                    validators : {
                        notEmpty : {/*非空提示*/
                            message : '请选择联系人'
                        }
                    }
                },
                reason : {
                    validators : {
                        notEmpty : {/*非空提示*/
                            message : '请填写事由'
                        }
                    }
                },
                result : {
                    validators : {
                        notEmpty : {/*非空提示*/
                            message : '请填写联系结果'
                        }
                    }
                }
            },
            submitHandler : function(validator,form, submitButton) {
                validator.defaultSubmit();
            }
        });
    }
</script>
</html>